/*
 * @Author: yangy aidreams@sina.com
 * @Date: 2024-03-04 10:22:25
 * @LastEditors: yangy aidreams@sina.com
 * @LastEditTime: 2024-03-12 12:04:11
 * @FilePath: /vue3-framework/vite.config.js
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
 */

// vite.config.js
import { defineConfig } from "vite";
import path from "path";
import vue from "@vitejs/plugin-vue";
import Components from "unplugin-vue-components/vite";
import { VantResolver } from "unplugin-vue-components/resolvers";

// https://vitejs.dev/config/
export default defineConfig({
  server: {
    //在 Vite 的配置文件中，serve 部分用于配置开发服务器的选项。hmr 是其中一个选项，它的作用是开启或关闭模块热更新（Hot Module Replacement）功能
    // 模块热更新是一种在开发过程中的实时更新机制，它使得在修改代码后，开发服务器能够在不刷新整个页面的情况下，仅仅更新被修改的模块，从而加快开发速度和提高开发效率
    hmr: true,
    port: 8080,
    // 运行时 是否自动打开浏览器
    open: true,
    // 跨域设置
    proxy: {
      // 当请求地址以 '/api' 开头时，将其代理到目标地址
      "/api": {
        target: "http://api.example.com", // 目标地址
        changeOrigin: true, // 是否改变请求源地址
        rewrite: (path) => path.replace(/^\/api/, ""), // 重写路径，可选
      },
    },
  },
  plugins: [vue(), Components({ resolvers: [VantResolver()] })],
  resolve: {
    alias: {
      // "@": path.resolve("./src"), // @代替src
      "@": path.resolve(__dirname, "src"), // 将 '@' 映射为 'src' 目录的绝对路径
    },
  },
  css: {
    // CSS 预处理器
    preprocessorOptions: {
      //define global scss variable
      scss: {
        javascriptEnabled: true,
        additionalData: `@use "@/assets/styles/variables.scss" as *;`,
      },
    },
  },
});
